<template>
	<view class="container flex u-flex-col a-c">
		<u-form :model="form" ref="uForm" class="form">
			<view class="u-flex j-c">
				<u-image width="150rpx" height="102rpx" style="margin: 30rpx auto" border-radius="10rpx"
					src="http://shendu-1300618810.cos.ap-nanjing.myqcloud.com/1648010661401">
				</u-image>
			</view>
			<view class="flex j-c font40 bold c-m"> 慎独家政服务 </view>

			<u-form-item left-icon="account">
				<u-input v-model="form.username" placeholder="请输入用户名" />
			</u-form-item>
			<u-form-item left-icon="lock">
				<u-input type="password" v-model="form.password" placeholder="请输入密码" />
			</u-form-item>
			<u-form-item left-icon="lock">
				<u-input type="password" v-model="form.password_confirm" placeholder="再次输入密码" />
			</u-form-item>
			<u-button type="error" @click="handleLogin" :loading="loading">现在注册</u-button>
			<view class="flex j-s">
				<navigator open-type="switchTab" url="/pages/main/tabbar/index/index"
					style="color: #ccc; padding: 10rpx 0">
					跳过登录</navigator>
				<navigator url="/pages/main/account/phone-login" style="color: #ccc; padding: 10rpx 0">
					现在登录</navigator>
			</view>
		</u-form>
	</view>
</template>

<script>
	import md5Libs from "uview-ui/libs/function/md5";
	import { SEND_SMS_INTERVAL } from "@/config";
	import { HOME_PAGE_PATH } from "@/config/index";
	import { KEY_TOKEN, KEY_REDIRECT_PATH, KEY_LOGIN_USER_INFO } from "@/config/constant";

	let app = getApp();
	export default {
		data() {
			return {
				form: {
					username: "cxd",
					password: "123123",
					password_confirm: "123123",
				},
				waiting: false,
				limitSec: SEND_SMS_INTERVAL,
				loading: false,
			};
		},
		onShow() {
			// if (this.$checkLogin()) this.$go2(HOME_PAGE_PATH, true)
		},
		methods: {
			async handleLogin() {
				if (!this.$u.test.rangeLength(this.form.username, [4, 20]))
					return this.$msg("用户名长度应为4至20位");
				if (!this.$u.test.rangeLength(this.form.password, [6, 20]))
					return this.$msg("密码长度限制为6至20位");
				if (this.form.password !== this.form.password_confirm)
					return this.$msg("两次密码不一致");
				try {
					this.loading = true;
					let { success, data } = await this.$postB(
						"/user/register", {
							username: this.form.username,
							password: md5Libs.md5(this.form.password),
							password_confirm: md5Libs.md5(this.form.password_confirm),
						},
						false
					);
					if (success) {
						this.$setCache(KEY_TOKEN, data);
						this.$msg("注册成功", async () => {
							if (data) {
								uni.switchTab({
									url: "/pages/main/tabbar/mine/mine",
								});
							} else this.$redirectAfterLogin();
						});
					} else {
						this.$msg(data || "注册失败");
					}
				} catch (e) {
					// this.$msg("注册失败");
				}finally{
					this.loading = false;
				}
			},
		},
	};
</script>

<style lang="scss" scoped>
	.container {
		overflow: hidden;
	}

	.form {
		width: 80%;
		padding: 200rpx 0;

		/deep/ {
			.wx-btn {
				padding: 300rpx 0;
			}
		}
	}
</style>
